<template>
	<div class="container">
		<el-form label-width="140px" :model="ruleForm" :rules="rules">
			<div class="container">
				 <h3>时间授权</h3>
				<el-row style="margin-top:20px;">
					 <el-col :span="7">
						 <el-form-item label="企业名称：">
							 {{ruleForm.abbreviation}}
						 </el-form-item>
						 <el-form-item label="所在地区：">
							{{ruleForm.area}}			 
						 </el-form-item>
					 </el-col>
					 <el-col :span="7">
						 <el-form-item label="联系人：">
							{{ruleForm.legalName}}	 
						 </el-form-item>
						 <el-form-item label="统一社会信用代码：">
								{{ruleForm.creditCode}}
						 </el-form-item>
					 </el-col>
					 <el-col :span="7">
						 <el-form-item label="联系人电话：">
								{{ruleForm.legalPhone}}			 
						 </el-form-item>
					 </el-col>
				</el-row>
			</div>
			<div class="container" style="margin-top:20px;">
				<el-row>
					<el-col>
						<el-form-item label="授权截止时间">
							<el-date-picker
								style="width:300px"
							    v-model="value1"
							    value-format="yyyy/MM/dd"
							    type="date"
							    placeholder="选择日期">
							</el-date-picker>
						</el-form-item>
					</el-col>
				</el-row>
			</div>
			<div class="container" style="margin-top:20px;">
				 <h3 style="margin-bottom: 20px">变更记录</h3>
				 
				 <el-table :data="tableData" border ref="multipleTable" header-cell-class-name="table-header" style="margin-top: 20px">
					 <el-table-column prop="person" sortable label="操作人"></el-table-column>
					 <el-table-column prop="operation" sortable label="操作行为"></el-table-column>
					 <el-table-column prop="datetime" sortable label="操作时间"></el-table-column>
					 
				 </el-table>
			</div>
			<el-form-item class="footerFixed" label-width="0px">
			    <el-button type="primary" @click="submitrule('ruleForm')">提交</el-button>
			    <el-button @click="backPage">返回</el-button>
			</el-form-item>
		</el-form>
	</div>
</template>

<script>
	import { CodeToText } from 'element-china-area-data';
	import {
		goverment_check,
		company_change_expiretime,
		company_get_update
	} from "@/request/supervisionCenterApi.js"
	export default{
		data(){
			return{
				ruleForm:{
					time: '',
				},
				tableData:[],
				rules:{},
				value1: '',
			}
		},
		mounted(){
			this.id = this.$route.query.id
			this.init()
		},
		methods:{
			init(){
				goverment_check(this.id).then((res)=>{
					this.ruleForm = res.data
					// console.log(this.ruleForm.expiretimeEnd)
					if(this.ruleForm.expiretimeEnd){
						this.value1 = this.ruleForm.expiretimeEnd
					}
					// console.log(this.ruleForm.time)
					var list = this.ruleForm.area.split(",")
					var arr = ""
					for (let k = 0; k < list.length; k++) {
					    arr += CodeToText[list[k]] + "/"   
					}  
					  this.ruleForm.area = arr.substr(0,arr.length-1)
				})
				company_get_update(this.id).then((res)=>{
					this.tableData = res
				})
			},
			// 返回上一页
			backPage(){
				this.$router.go(-1)
			},
			
			
			// 提交
			submitrule(){
				var myDate = new Date();
				var starttime = myDate.toLocaleString();
				console.log(starttime)
				let data = {
					companyId:this.id,
					expiretimeEnd:this.value1,
					expiretime:starttime
				}
				company_change_expiretime(data).then((res)=>{
					this.$notify({
					    title: '操作成功',
					    message: '授权成功',
					    type: 'success'
					});
					this.$router.go(-1)
				})
			},
		}
	}
</script>

<style scoped>
	
</style>